<template>
  <div class="item-list">
    <div class="item" @click="details" v-for="d in state.DepartmentList" :key="d.id">
      <div class="imgBox">
        <dsfimg :src="getImg(d)" :errorSrc="config.setting_img" />
      </div>
      <p>{{ d.name }}</p>
    </div>
  </div>
</template>
<script setup>
import { reactive, onMounted, inject } from "vue";
import { useRouter } from "vue-router";
const route = useRouter();
const http = inject("ajax");
const config = inject("config");
const loginState = inject("loginState");
onMounted(() => {
  getData();
});
let state = reactive({
  DepartmentList: [],
});
const getData = () => {
  http("/iaiqsmde9fea569965ed56ab98ea0501752fe631902841e/deptRecommendList", {}, "GET")
    .then(res => {
      state.DepartmentList = res.data;
    })
    .catch(err => {
      console.log(err.message || "数据异常");
    });
};
const getImg = d => {
  return new URL(`../../../assets/imgs/pc/sindex/Department/${d.name}.png`, import.meta.url).href;
};
const details = () => {
  loginState().then(() => {
    route.push({
      path: "/DataDirectory",
      query: {
        name: "部门资源",
      },
    });
  });
};
</script>
